import axios from 'axios'
/**
 * @type {import('vuex').Module}
 */
export default {
    namespaced: true,
    state: {
        list: [],
    },
    mutations: {
        //获取list
        pushlist(state, data) {
            state.list = data.filter(item => {
                return item
            })
            // console.log(state.list);
        },
        //删除元素
        delitem(state, id) {
            state.list = state.list.filter(item => {
                return item.id !== id;
            });
        },
        // //增加元素
        // pushitem(state){
        //     state.list = state.list.filter(item => {
        //         return item.id !== id;
        //     });
        // }
        pickYou(state, res) {
            state.list = res.filter(item => {
                return item.isDone === false
            })
        },
        overpick(state, res) {
            state.list = res.filter(item => {
                return item.isDone === true
            })
        }
    },
    actions: {
        //获取list
        async getlist(context) {
            const res = await axios({
                method: 'get',
                url: 'http://localhost:3000/list'
            })
            context.commit('pushlist', res.data)
        },
        //删除元素
        async removeitem(context, id) {
            await axios({
                method: 'delete',
                url: `http://localhost:3000/list/${id}`,
            })
            context.commit('delitem', id)
        },
        //添加元素
        async additem(context, data) {
            await axios({
                method: 'post',
                url: `http://localhost:3000/list/`,
                data
            })
            //直接调用getlist方法
            context.dispatch('getlist')
        },
        //反选
        allisDone(context, goods) {
            goods.forEach(async item => {
                await axios({
                    method: 'patch',
                    url: `http://localhost:3000/list/${item.id}`,
                    data: {
                        isDone: !item.isDone
                    }
                })
            });
            context.dispatch('getlist')
        },
        //打勾
        async tickItem(context, item) {
            await axios({
                method: 'patch',
                url: `http://localhost:3000/list/${item.id}`,
                data: {
                    isDone: !item.isDone
                }
            })
            context.dispatch('getlist')
        },
        //清除已勾选
        cleartick(context, goods) {
            goods.forEach(async item => {
                if (item.isDone) {
                    await axios({
                        method: 'delete',
                        url: `http://localhost:3000/list/${item.id}`,
                    })
                    context.commit('delitem', item.id)
                }
            })
        },
        //筛选功能
        async pickAxios(context, status) {
            console.log(status);
            if (status === 'all') {
                context.dispatch('getlist')
            } else if (status === 'go') {
                const res = await axios({
                    method: 'get',
                    url: 'http://localhost:3000/list'
                })
                context.commit('pickYou', res.data)
            } else if (status === 'over') {
                const res = await axios({
                    method: 'get',
                    url: 'http://localhost:3000/list'
                })
                context.commit('overpick', res.data)
            }
        }
    },
    getters: {
        num(state) {
            const count = state.list.filter(item => {
                return item.isDone === false
            })
            return count.length
        }
    },
}